<template>
  <div>
    <h1>AQI 反馈详情</h1>
    <input v-model="feedbackId" placeholder="请输入反馈 ID" />
    <button @click="fetchFeedbackDetail">获取详情</button>
    <div v-if="feedbackDetail">
      <p><strong>反馈信息：</strong>{{ feedbackDetail.information }}</p>
      <p><strong>日期：</strong>{{ feedbackDetail.afDate }}</p>
      <p><strong>时间：</strong>{{ feedbackDetail.afTime }}</p>
      <p><strong>预估等级：</strong>{{ feedbackDetail.estimatedGrade }}</p>
      <p><strong>省份：</strong>{{ feedbackDetail.gridProvince.name }}</p>
      <p><strong>城市：</strong>{{ feedbackDetail.gridCity.name }}</p>
    </div>
  </div>
</template>

<script>
import { getFeedbackDetailById } from '@/services/aqiFeedbackService';

export default {
  data() {
    return {
      feedbackDetail: null,
      feedbackId: '', // 用户输入的反馈 ID
    };
  },
  methods: {
    async fetchFeedbackDetail() {
      try {
        this.feedbackDetail = await getFeedbackDetailById(this.feedbackId);
      } catch (error) {
        alert('获取反馈详情失败：' + error.message);
      }
    },
  },
};
</script>